<template v-slot="navlist">
    <div>
        <van-tabs
      v-model:active="active"
      sticky
      title-active-color="#333"
      title-inactive-color="#999"
      color="#7654ff"
      @click-tab="onClickTab"
    >
      <van-tab v-for="(item,index) in navList" :key="item" :title="item" :name="(index+1)"
        >
        <showContentItem :Cid="Cid"/>
      </van-tab>
</van-tabs>

    </div>
</template>
<script>
import { ref } from "vue";
import showContentItem from "./ShowContentItem.vue";
export default {
  props:['navList'],
  setup() {
    const active = ref(0);
    return { active };
  },
  data() {
    return {
      dataList: [],
      Cid: 1,
    };
  },

  methods: {
    handleChangePage(id) {
      this.$router.push({
        name: "activity",
        params: {
          id: id,
        },
      });
    },
    onClickTab(e) {
      console.log(e.name);
      this.Cid = e.name;
    },
  },
  components: {
    showContentItem,
  },
};
</script>
<style>
.van-tabs__content{
  padding-bottom:32px;
}
</style>

